<template>
	<div class="container">
		<div class="center">
			<slot></slot>
		</div>
	</div>
</template>

<script setup lang="ts"></script>

<style scoped lang="less">
.container {
	width: 100vw;
	height: 100vh;
	min-height: 100vh; // 确保最小高度为视口高度
	background-image: url('@/assets/login/bj.png');
	background-size: cover; // 保持比例缩放，覆盖整个容器
	background-repeat: no-repeat; // 不重复
	background-position: center center; // 水平和垂直居中
	background-attachment: fixed; // 背景图固定，滚动时不移动
	// 确保在不同设备上都能正常显示
	overflow: hidden; // 防止内容溢出

	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
}
</style>
